<template>
  <t-dialog
    header="审批"
    :visible.sync="visible"
    :onClose="closeDialog"
    :closeOnOverlayClick="false"
    :confirmBtn="null"
    width="90%"
    top="5%"
  >
    <div style="height: 65vh">
      <thesis-detail v-if="row.approveType==='1'" :objId="row.achievement.id"></thesis-detail>
      <treatise-detail v-else-if="row.approveType==='2'" :objId="row.achievement.id"></treatise-detail>
      <patent-detail v-if="row.approveType==='3'" :objId="row.achievement.id"></patent-detail>
      <copyright-detail v-if="row.approveType==='4'" :objId="row.achievement.id"></copyright-detail>
      <awards-detail v-if="row.approveType==='5'" :objId="row.achievement.id"></awards-detail>
      <other-detail v-if="row.approveType==='6'" :objId="row.achievement.id"></other-detail>
      <t-drawer
        :visible="drawerVisible"
        showInAttachedElement
        :showOverlay="false"
        :size="'37%'"
        :preventScrollThrough="false"
        header="评审内容"
      >
        <t-form ref="form" :data="formData" :rules="rules">
          <t-form-item label="审批业务类型：" name="approveType">
            <t-select disabled v-model="formData.approveType" clearable style="width: 390px"
                      :options="dict.type.cgzh_approve_type">
            </t-select>
          </t-form-item>

          <t-form-item v-if="formData.approveStatus === '3'" label="审批意见：">
            <t-textarea  :autosize="{minRows: 5}"
                         v-model="formData.opinion" placeholder="请输入内容"/>
          </t-form-item>
          <t-form-item v-else name="opinion" label="审批意见：">
            <t-textarea style="width: 390px" :autosize="{minRows: 5}"
                        v-model="formData.opinion" placeholder="请输入内容"/>
          </t-form-item>

          <t-form-item label="审批结果：" name="approveStatus">
            <t-radio-group v-model="formData.approveStatus">
              <t-radio value="3" label="通过"></t-radio>
              <t-radio value="4" label="退回"></t-radio>
            </t-radio-group>
          </t-form-item>
        </t-form>
        <template #footer>
          <t-button theme="default" @click="closeDrawer">关闭评审界面</t-button>
          <t-button theme="primary" @click="onSubmit()">提交审批</t-button>
        </template>
      </t-drawer>
      <t-drawer
        :visible="drawerApproveVisible"
        showInAttachedElement
        :showOverlay="false"
        size="80%"
        :preventScrollThrough="false"
        header="审批记录"
      >
        <approve-list v-if="drawerApproveVisible" :isDialog="false" :objId="row.achievement.id"></approve-list>
        <template #footer>
          <t-button theme="default" @click="drawerApproveVisible = false">关闭审批记录</t-button>
        </template>
      </t-drawer>
    </div>
    <template #footer>
      <t-button theme="default" @click="closeDialog">取消</t-button>
      <t-button theme="default" variant="outline" @click="drawerApproveVisible = true">审批记录</t-button>
      <t-button theme="primary" @click="drawerVisible = true">打开评审界面</t-button>
    </template>
  </t-dialog>
</template>

<script>
import thesisDetail from "../../thesis/components/thesis-detail.vue";
import treatiseDetail from "../../treatise/components/treatise-detail.vue";
import patentDetail from "../../patent/components/patent-detail.vue";
import copyrightDetail from "../../copyright/components/copyright-detail.vue";
import awardsDetail from "../../awards/components/awards-detail.vue";
import otherDetail from "../../other/components/other-detail.vue";
import ApproveList from "./approve-list.vue";

export default {
  name: "approve-info",
  components:{
    thesisDetail,
    treatiseDetail,
    patentDetail,
    copyrightDetail,
    awardsDetail,
    otherDetail,
    ApproveList
  },
  props: {
    row: Object
  },
  dicts: ['cgzh_approve_type'],
  data(){
    return {
      visible: true,
      drawerApproveVisible: false,
      drawerVisible: false,
      formData: {
        id: this.row.id,
        businessId: this.row.businessId,
        approveType: this.row.approveType,
        opinion: '',
        approveStatus: "3",
      },
      rules: {
        opinion: [
          {required: true, message: "审批意见不能为空"}
        ],
        approveStatus: [
          {required: true, message: "审批结果不能为空"}
        ],
      },
    }
  },
  methods:{
    onSubmit() {
      this.$refs.form.validate().then((validateResult) => {
        if (validateResult === true) {
          let loading = false;
          const confirmDia = this.$dialog.confirm({
            header: "审批提示",
            body: `是否确认提交？`,
            confirmBtn: {
              content: loading ? '提交中...' : '提交',
              theme: 'primary',
              loading,
            },
            theme: "warning",
            onConfirm: ({e}) => {
              if (this.formData.approveStatus === "3" && this.formData.opinion === '') {
                this.formData.opinion = "通过"
              }
              loading = true
              this.$api.cgzh.approve.opApprove(this.formData).then(response => {
                this.$message.success('提交成功');
                this.$emit("reload");
                this.$emit("update:visible", false);
                confirmDia.destroy();
                loading = false
              }).catch((e) => {
                loading = false
                this.$message.error(e.toString());
              });
            },
          })

        } else {
          const firstError = Object.values(validateResult)[0]?.[0]?.message;
          this.$message.error(firstError);
        }
      })
    },
    closeDrawer() {
      this.drawerVisible = false
    },
    closeDialog() {
      this.$emit("update:visible", false);
    },
  }
}
</script>

<style scoped>

</style>
